<template lang="html">
  <div id="pageBox">
    <div class="moneyBox">
      <p class="money">￥0.00</p>
      <p class="note">当前余额(元)</p>
    </div>
    <div class="getMonyeBox">
      <div class="moneyBox1">
        <p class="money">￥0.00</p>
        <p class="note">总收益(元)</p>
      </div>
      <div class="shu"></div>
      <div class="moneyBox1">
        <p class="money">￥0.00</p>
        <p class="note">推广收益(元)</p>
      </div>
    </div>
    <div class="list pd14">
      <div class="item">
        收益明细
        <span class="icon iconfont icon-rjt"></span>
      </div>
      <div class="item">
        提现记录
        <span class="icon iconfont icon-rjt"></span>
      </div>
    </div>
  </div>
</template>

<script>
export default {

}
</script>

<style lang="less" scoped>
  #pageBox{
    .moneyBox{
      padding:0.2rem 0;
      text-align: center;
      .money{
        font-size:0.28rem;
        color:#FF6685;
        font-weight: bold;
      }
      .note{
        font-size:0.12rem;
        color:#999;
      }
    }
    .getMonyeBox{
      display: flex;
      position: relative;
      border-bottom:1px solid #dedede;
      .moneyBox1{
        flex:1;
        text-align: center;
        padding:0.1rem 0;
        .money{
          font-size:0.18rem;
          font-weight:bold;
        }
        .note{
          font-size:0.12rem;
          color:#999;
        }
      }
      .shu{
        position: absolute;
        left:50%;
        top:50%;
        margin-top:-0.15rem;
        width:1px;
        height:0.3rem;
        background:#dedede;
      }
    }
    .list{
      .item{
        position:relative;
        line-height: 0.6rem;
        font-size:0.16rem;
        font-weight: 400;
        border-bottom:1px solid #dedede;
        .icon{
          position: absolute;
          right:0;
          color:#999;
          font-size:0.2rem;
        }
      }
    }
  }
</style>
